<template>
    <ul>
        <li @click="showName(item.name)" v-for="(item,index) in list" :key="item.id">
            {{index+1}}-{{ item.name }}
        </li>
    </ul>

    <button v-on:mouseleave="handle">确认</button>
</template>

<script setup>
    const list = [
        {id:1,name: "绅士"},
        {id:2,name: "初学者"},
        {id:3,name: "暧昧"},
        {id:4,name: "AI"},
        {id:5,name: "传说"},
        {id:6,name: "好久没见"},
    ]

    const handle = () => {
        console.log('handle')
    }

    const showName = (name) => {
        console.log(name)
    }
</script>

<style lang="css" scoped>

</style>